import defaultTheme from 'tailwindcss/defaultTheme';
import forms from '@tailwindcss/forms';

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
        './resources/js/**/*.vue',
    ],

    theme: {
        extend: {
            fontFamily: {
                sans: ['Figtree', ...defaultTheme.fontFamily.sans],
            },
            // 使用 Tailwind 默认颜色系统的语义化别名
            // 根据 Tailwind CSS v3 文档：在 theme.extend.colors 中可以直接使用颜色值
            // 这些值对应 Tailwind 默认 gray 色阶，确保与官方颜色系统一致
            colors: {
                // 主色系：映射到 Tailwind gray 色阶（与 gray-900, gray-50 等对应）
                primary: '#111827',           // gray-900
                'primary-foreground': '#ffffff', // white
                secondary: '#f9fafb',         // gray-50
                'secondary-foreground': '#111827', // gray-900
                muted: '#f9fafb',            // gray-50
                'muted-foreground': '#6b7280',   // gray-500
                accent: '#f3f4f6',           // gray-100
                'accent-foreground': '#111827',  // gray-900
                border: '#e5e7eb',           // gray-200
                background: '#ffffff',         // white
                foreground: '#111827',        // gray-900
                card: '#ffffff',              // white
                'card-foreground': '#111827', // gray-900
                input: '#e5e7eb',            // gray-200
            },
        },
    },

    plugins: [forms],
};
